.flex {
  display: flex;

  &.center {
    align-items: center;
    justify-content: center;
  }

  $aligns: (
    start: flex-start,
    center: center,
    end: flex-end
  );
  @each $key, $value in $aligns {
    &.align-#{$key} {
      align-items: $value;
    }
  }

  $justifys: (
    start: flex-start,
    center: center,
    end: flex-end,
    between: space-between
  );
  @each $key, $value in $justifys {
    &.justify-#{$key} {
      justify-content: $value;
    }
  }
}
